<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1,user-scalable=0" name="viewport">
    <title>储值卡详情</title>
    <link href="../../public/plugin/weui/weui.min.css" rel="stylesheet">
    <link href="../../public/plugin/jquery-weui/css/jquery-weui.min.css" rel="stylesheet">
    <link href="../../public/plugin/vant/index.css" rel="stylesheet">
    <link href="../../public/css/iconfont.css?v=20210227" rel="stylesheet">
    <link href="../../public/css/common.css" rel="stylesheet">
</head>

<style type="text/css">
</style>

<body>
<div id="app" style="overflow-y: auto;" v-cloak>
    <!-- 卡集合 -->
    <div>
        <div class="card-baseInfo">
            <div class="card-log">VIP</div>
            <div class="card-name">{{cardInfo.cardName}}</div>
            <div class="card-no">{{cardInfo.cardNo}}</div>
            <div class="card-balance">{{cardInfo.balance}}</div>
        </div>
    </div>
    <van-cell-group>
        <van-cell :value="cardInfo.cardNo" title="卡号"></van-cell>
        <van-cell :value="cardInfo.cardName" title="卡名称"></van-cell>
        <van-cell :value="cardInfo.balance" title="可用余额"></van-cell>
        <van-cell :value="cardInfo.cardTypeName" title="卡类型"></van-cell>
        <van-cell :value="cardInfo.buildDate" title="建卡日期"></van-cell>
        <van-cell @click="openRechargeRecords" is-link title="充值记录" value="详情"></van-cell>
        <van-cell @click="openConsumeRecords" is-link title="消费记录" value="详情"></van-cell>
    </van-cell-group>
</div>
<script src="../../public/plugin/jquery/jquery.min.js" type="text/javascript"></script>
<script src="../../public/plugin/jquery-weui/js/jquery-weui.min.js" type="text/javascript"></script>
<script src="../../public/plugin/vue/vue.min.js" type="text/javascript"></script>
<script src="../../public/plugin/vant/vant.min.js" type="text/javascript"></script>
<script src="../../public/plugin/moment/moment.min.js" type="text/javascript"></script>
<script src="../../public/js/common.js?v=20230726011" type="text/javascript"></script>
<script>
    let app = new Vue({
        el: '#app',
        data: {
            cardInfo: {},
            cardNo: ''
        },
        mounted: function () {
            let self = this;
            self.cardNo = getUrlParam("cardNo");
            CardUtils.getCardInfoByNo(self.cardNo).then(function (res) {
                self.cardInfo = res.data;
            })
        },
        methods: {
            openRechargeRecords: function () {
                let self = this;
                window.location.href = "../card/recharge-records.html?cardNo=" + self.cardNo
            },
            openConsumeRecords: function () {
                let self = this;
                window.location.href = "../card/consume-records.html?cardNo=" + self.cardNo
            }
        }
    });
</script>
</body>
</html>
